<template>
  <div>
    <van-search class="info_search input_text" v-model="value" @search="onSearch" @clear="clearSearch" placeholder="搜索" />
    <van-list :finished="myFinished" v-model="myLoading" finished-text="没有更多了" @load="myOnLoad">
      <van-cell class="card" @click="openDetail(item)" v-for="(item, index) in myList" :key="index">
        <div>
          <div>
            <div class="title">
              <div>{{ item.AccidentName }}</div>
            </div>
            <van-row gutter="20">
              <van-col>
                <img class="icon" src="@/assets/Images/AppIcon/icon_list_date.png" />发生日期：{{ item.HappenDate|formatDate }}
              </van-col>
            </van-row>
            <van-row gutter="20">
              <van-col>
                <img class="icon" src="@/assets/Images/AppIcon/icon_list_area.png" />发生地点：{{ item.Address }}
              </van-col>
            </van-row>
            <van-row gutter="20">
              <van-col>
                <img class="icon" src="@/assets/Images/AppIcon/icon_list_type.png" />事件类型：{{ item.TypeName }}
              </van-col>
            </van-row>
            <van-row gutter="20">
              <van-col>
                <img class="icon" src="@/assets/Images/AppIcon/icon_list_user.png" />录入人：{{ item.CreateChnName }}
              </van-col>
            </van-row>
            <van-row gutter="20">
              <van-col>
                <img class="icon" src="@/assets/Images/AppIcon/icon_list_date.png" />录入时间：{{ item.CreateDate|formatDate }}
              </van-col>
            </van-row>
          </div>
        </div>
      </van-cell>
    </van-list>
  </div>
</template>

<script>
import { gxNonResponsibilityEmergencyList } from "@/api/gx";
export default {
  data() {
    return {
      value: "",
      myList: [],
      myFilter: {
        page: 0,
        dataType: "List",
      },
      loading: false,
      finished: false,
      myLoading: false,
      myFinished: false,
    };
  },
  created() {
    this.getMyList();
  },
  methods: {
    onSearch() {
      var conditions1 = [];
      if (this.value) {
        conditions1.push({
          Name: "Keywords",
          DisplayName: this.value,
          Value: this.value,
          Operator: "like",
          DataType: "String",
        });
      }
      this.myFilter.page = 0;
      this.myFilter.conditions = JSON.stringify(conditions1);
      this.getMyList();
    },
    clearSearch() {
      this.myFilter = {
        page: 0,
        dataType: "List",
      };
      this.value = "";
      this.getMyList();
    },
    getMyList() {
      this.myLoading = true;
      gxNonResponsibilityEmergencyList(this.myFilter).then((res) => {
        this.myLoading = false;
        if (!res.data.HasNextPage) {
          this.myFinished = true;
        }
        this.myList = res.data.Data;
        this.myFilter.page = res.data.PageIndex;
      });
    },
    myOnLoad() {
      this.myLoading = true;
      ++this.myFilter.page;
      list(this.myFilter).then((res) => {
        this.myLoading = false;
        this.myFilter.page = res.data.PageIndex;
        this.myList = this.myList.concat(res.data.Data);
        if (!res.data.HasNextPage) {
          this.myFinished = true;
        }
      });
    },
    openDetail(item) {
      this.$router.push({
        path: "/GXNonResponsibilityEmergencyView",
        query: { id: item.ID },
      });
    }
  },
};
</script>

<style lang="less" scoped>
</style>
